import { Tabs, } from '@aws-amplify/ui-react';
import { Example, ExampleCode } from '@/components/Example';

<Tabs.Container defaultValue="InAppMessagingProvider" className="docs-tabs">
  <Tabs.List>
    <Tabs.Item value="InAppMessagingProvider">InAppMessagingProvider</Tabs.Item>
    <Tabs.Item value="withInAppMessaging">withInAppMessaging</Tabs.Item>
  </Tabs.List>
  <Tabs.Panel value="InAppMessagingProvider">
    <Example>
      <ExampleCode>
```js file=../../../../../../../examples/next/pages/ui/components/in-app-messaging/basic-usage-provider/index.page.tsx

```
      </ExampleCode>
    </Example>
      
  </Tabs.Panel>
  <Tabs.Panel value="withInAppMessaging">
    <Example>
      <ExampleCode>
      ```js file=../../../../../../../examples/next/pages/ui/components/in-app-messaging/basic-usage-hoc/index.page.tsx

      ```
      </ExampleCode>
    </Example>
  </Tabs.Panel>
</Tabs.Container>
